/**
 * Created by 小敏哥 on 2017/10/10.
 */
import React, {Component} from 'react';
import style from './index.scss';

class OrderListItem extends Component {
    constructor(props) {
        super(props);
    }

    static propTypes = {
        title: React.PropTypes.string,//标题
        orderAmount: React.PropTypes.number,//支付金额
        createTime: React.PropTypes.string,//下单时间
        status: React.PropTypes.number,//订单状态
        orderId: React.PropTypes.string,//订单编号
    };

//跳转到订单详情
    goToOrderDetail() {
        let orderDetailUrl = location.href.split('/#')[0].split('#')[0];
        if (orderDetailUrl.indexOf('?') > 0) {
            orderDetailUrl += '&type=orderList&OutTradeNo=' + this.props.orderId
        }
        else {
            orderDetailUrl += '?type=orderList&OutTradeNo=' + this.props.orderId
        }
        orderDetailUrl += '/#/orderDetails';
        location.href=orderDetailUrl;
    }

    render() {
        let statusDic = {
            1: '待付款',
            2: '已付款',
            3: '已删除',
            4: '已退单',
            5: '不支持办理',
            6: '部分办理中',
            7: '正在办理',
            8: '已完成',
            9: '已结单',
            10: '待审核',
            11: '支付异常',
            12: '已退款',
            13: '已关闭',
        };
        return <div className={style.container} onClick={() => {
            this.goToOrderDetail();
        }}>
            <img src="./images/order-list-icon.png"/>
            <div className={style.content}>
                <div className={style.contentItem}>
                    <div className={style.title}>{this.props.title}</div>
                    <div className={style.amount + ' ' + style.red}>￥{this.props.orderAmount}</div>
                </div>
                <div className={style.contentItem}>
                    <div className={style.grey}>下单时间：{this.props.createTime}</div>
                    <div
                        className={this.props.status != 4 ? style.darkGray : style.red}>{statusDic[this.props.status]}</div>
                </div>
            </div>
        </div>
    }
}

export default OrderListItem;